.generate-distance(@i) when (@i<=200) {
  .m-@{i} {
    margin: (@i) !important;
  }
  .m-t-@{i} {
    margin-top: (@i * 1px) !important;
  }
  .m-b-@{i} {
    margin-bottom: (@i * 1px) !important;
  }
  .m-l-@{i} {
    margin-left: (@i * 1px) !important;
  }
  .m-r-@{i} {
    margin-right: (@i * 1px) !important;
  }
  .p-@{i} {
    padding: (@i * 1px) !important;
  }
  .p-t-@{i} {
    padding-top: (@i * 1px) !important;
  }
  .p-b-@{i} {
    padding-bottom: (@i * 1px) !important;
  }
  .p-l-@{i} {
    padding-left: (@i * 1px) !important;
  }
  .p-r-@{i} {
    padding-right: (@i * 1px) !important;
  }
  .fs-@{i} {
    font-size: (@i * 1px) !important;
  }
  .generate-distance((@i+1));
}

.generate-distance(-1);

.display-flex {
  display: flex;
}

.display-none {
  display: none !important;
}

.display-block {
  display: block !important;
}

.display-inline-block {
  display: inline-block;
}

.flex1 {
  flex: 1;
}

.position-r {
  position: relative;
}

.position-a {
  position: absolute;
}

.position-f {
  position: fixed;
}

.tc {
  text-align: center;
}

.tl {
  text-align: left;
}

.tr {
  text-align: right;
}
